<template>
  <basic-container class="noScrollBar tabMain-wrap">
    <avue-crud
            :option="detailOptions.options"
            :table-loading="loading"
            :data="data"
            :page.sync="page"
            ref="crud"
            v-model="form"
            :permission="permissionList"
            @row-save="rowSave"
            @row-update="rowUpdate"
            @search-change="searchChange"
            @search-reset="searchReset"
            @selection-change="selectionChange"
            @current-change="currentChange"
            @size-change="sizeChange"
            @refresh-change="refreshChange"
            :upload-after="uploadAfter"
            @on-load="onLoad"
    >
      <template slot-scope="{ row }" slot="menu">
        <el-button @click="rowDel(row)" v-show="userInfo.user_id==row.createUser" type="text" size="small" icon="el-icon-remove">删除</el-button>
        <el-button @click="rowEditForm(row)" v-show="userInfo.user_id==row.createUser" type="text" size="small" icon="el-icon-edit">编辑</el-button>
        <el-button @click="print(row)"  type="text" size="small" icon="el-icon-mouse">文档下载</el-button>
      </template>
    </avue-crud>
    <el-drawer
            :visible.sync="showAddMenuDrawer"
            :direction="'ltr'"
            :title="caseTit"
            :size="'75%'"
            :center="false"
            :modal="false"
            :destroy-on-close="true">
    </el-drawer>
  </basic-container>
</template>
<script>
import { mapGetters } from "vuex";
import {getToken} from '@/util/auth';
import {
  getFileList,
  fileSave,
  fileUpdate,
  filePrint,
  fileRemove
} from "@/api/sxdky/sxdky";
export default {
  data() {
    return {
      // 文件预览
      filePrint:filePrint,
      forms:"",
      form: {},
      query: {},
      loading: true,
      page: {
          pageSize: 10,
          currentPage: 1,
          total: 0,
      },
      selectionList: [],
      data: [],
      infoData: [],
      detailOptions: {
        label: "文件管理",
        name: "fileList",
        options: {
          height: "calc(100vh - 425px)",
          addBtn: true,
          menuDelBtn: false,
          menuUpBtn: false,
          menuDownBtn: true,
          dialogDirection: "ltr",
          dialogType: "drawer",
          calcHeight: 30,
          tip: false,
          searchShow: true,
          searchMenuSpan: 6,
          border: true,
          index: true,
          menuForm: false,
          indexLabel: "序号",
          viewBtn: false,
          selection: true,
          excelBtn: false,
          dialogClickModal: false,
          menuOtherBtn: true,
          gistBtn: false,
          align: "center",
          menuAlign: "center",
          searchIcon: true,
          searchIndex: 3,
          labelWidth: 120,
          editBtn: false,
          delBtn: false,
          column: [
            {
                label: "上传文件",
                type: "upload",
                showFileList: true,
                loadText: "模板上传中，请稍等",
                span: 24,
                propsHttp: {
                    res: "data",
                },
                slot:true,
                hide:true,
                accept: ".docx,.doc,.zip",
                tip: "请上传标准格式文件",
                action: '/api/dis-report/file/upload?groupId=dnzl',
            },
            {
                label: "文件编码",
                prop: "code",
                editDisplay: true,
                viewDisplay: true,
                overHidden: true,
                search: true,
                addDisplay:true,
                span: 24,
                rules: [
                    {
                        required:true,
                        message: "请输入文件编码",
                        trigger: "click",
                    },
                ],
            },
            {
                label: "文件名称",
                prop: "name",
                editDisplay: true,
                viewDisplay: true,
                overHidden: true,
                search: true,
                addDisplay:true,
                span: 24,
                rules: [
                    {
                        required:true,
                        message: "请输入文件名称",
                        trigger: "click",
                    },
                ],
            },
            {
                label: "是否开放",
                prop: "isOpen",
                type: "select",
                search: true,
                addDisplay:true,
                editDisplay: true,
                viewDisplay: true,
                value: '1',
                dicData: [
                    {
                        label: "私有",
                        value: '0',
                    },
                    {
                        label: "公开",
                        value: '1',
                    }
                ],
            },
          ],
        },
        url: {
          getList: getFileList,
          remove: fileRemove,
          update: fileUpdate,
          add: fileSave,
        },
      },
    };
  },
  components: {},
  computed: {
        ...mapGetters(["permission", "userInfo"]),
        permissionList() {
            return {
                addBtn: this.vaildData(this.permission.dnzl_add, false),
                viewBtn: this.vaildData(this.permission.dnzl_add, false),
                delBtn: this.vaildData(this.permission.dnzl_add, false),
                editBtn: this.vaildData(this.permission.dnzl_add, false),
            };
        },
        ids() {
            let ids = [];
            this.selectionList.forEach((ele) => {
                ids.push(ele.id);
            });
            return ids.join(",");
        },
    },
    methods: {
        // 保存
        rowSave(row, done, loading) {
            row.payProof = this.payProof;
            this.detailOptions.url.add(row).then(
                () => {
                    this.onLoad(this.page);
                    this.$message({
                        type: "success",
                        message: "操作成功!",
                    });
                    done();
                },
                (error) => {
                    window.console.log(error);
                    loading();
                }
            );
        },
        // 调用编辑表单
        rowEditForm(row){
            this.$refs.crud.rowEdit(row);
        },
        // 更新
        rowUpdate(row, index, done, loading) {
            this.detailOptions.url.update(row).then(
                () => {
                    this.onLoad(this.page);
                    this.$message({
                        type: "success",
                        message: "操作成功!",
                    });
                    done();
                },
                (error) => {
                    window.console.log(error);
                    loading();
                }
            );
        },
        // 删除
        rowDel(row) {
            this.$confirm("确定将选择数据删除?", {
                confirmButtonText: "确定",
                cancelButtonText: "取消",
                type: "warning",
            })
                .then(() => {
                    return this.detailOptions.url.remove(row.id);
                })
                .then(() => {
                    this.onLoad(this.page);
                    this.$message({
                        type: "success",
                        message: "操作成功!",
                    });
                    this.$refs.crud.toggleSelection();
                });
        },
        // 打印下载
        print(row) {
            window.open(this.filePrint+`?id=${row.id}&${this.website.tokenHeader}=${getToken()}`);
        },
        searchReset() {
            this.query = {};
            this.onLoad(this.page);
        },
        searchChange(params, done) {
            this.query = params;
            this.page.currentPage = 1;
            this.onLoad(this.page, params);
            done();
        },
        selectionChange(list) {
            this.selectionList = list;
        },
        selectionClear() {
            this.selectionList = [];
            this.$refs.crud.toggleSelection();
        },
        listAllDelete() {
            if (this.selectionList.length === 0) {
                this.$message.warning("请选择至少一条数据");
                return;
            }
            this.$confirm("确定将选择数据删除?", {
                confirmButtonText: "确定",
                cancelButtonText: "取消",
                type: "warning",
            })
                .then(() => {
                    return this.detailOptions.url.remove(this.ids);
                })
                .then(() => {
                    this.onLoad(this.page);
                    this.$message({
                        type: "success",
                        message: "操作成功!",
                    });
                    this.$refs.crud.toggleSelection();
                });
        },
        currentChange(currentPage) {
            this.page.currentPage = currentPage;
        },
        sizeChange(pageSize) {
            this.page.pageSize = pageSize;
        },
        refreshChange() {
            this.onLoad(this.page, this.query);
        },
        onLoad(page,params = {}) {
            let values = {
                ...params,
            };
            this.loading = true;
            this.detailOptions.url.getList(page.currentPage, page.pageSize,values)
                .then((res) => {
                    const data = res.data.data;
                    this.page.total = data.total;
                    this.data = data.records;
                    this.loading = false;
                    this.selectionClear();
                });
        },
        selInfoChange(list) {
            console.log(list)
        },
        saveMenuData(row) {
            let selArr = [];
            this.selList.forEach(item => {
                selArr.push(item.id)
            })
            let selData = {
                id: row.id,
                ids: selArr.toString()
            }
            this.detailOptions.menuUrl.saveMenu(selData).then(
                () => {
                    this.$message({
                        type: "success",
                        message: "操作成功!",
                    });
                    this.showAddMenuDrawer = false;
                },
                (error) => {
                    window.console.log(error);
                }
            );
        },
        selMenuChange(list) {
            this.selList = list;
        },

        // 上传回调
        uploadAfter(res,done) {
            this.form.name = res.name;
            this.form.url = res.url;
            done();
        },
        cancelSignItem(rowData) {
            console.log(rowData)
        },
        cancelSign() {
            console.log(this.selectionList)
        },
    }
};
</script>

<style lang='scss'>
.tabMain-wrap {
  // height: calc(100vh - 400px);
  overflow: hidden auto;
}
.fileConList{
  p{
    margin: 0;
  }
  .scrollDiv{
    height: calc(100% - 90px);
    overflow: auto;
  }
}
</style>


